<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <title>类-使用静态方法和原型方法包装</title>
    </head>
    <body>
        <h1>类-使用静态方法和原型方法包装</h1>
        <p>来源:<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes">https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes</a></p>
        <p>当一个对象调用静态或原型方法时，如果该对象没有“this”值（或“this”作为布尔，字符串，数字，未定义或null) ，那么“this”值在被调用的函数内部将为 undefined。不会发生自动包装。即使我们以非严格模式编写代码，它的行为也是一样的，因为所有的函数、方法、构造函数、getters或setters都在严格模式下执行。因此如果我们没有指定this的值，this值将为undefined。</p>
        <script>
            // class Animal { 
            //   speak() {
            //     return this;
            //   }
            //   static eat() {
            //     return this;
            //   }
            // }

            // let obj = new Animal();
            // obj.speak(); // Animal {}
            // let speak = obj.speak;
            // speak(); // undefined

            // Animal.eat() // class Animal
            // let eat = Animal.eat;
            // eat(); // undefined
            // 如果我们使用传统的基于函数的类来编写上述代码，那么基于调用该函数的“this”值将发生自动装箱。
            function Animal() { }

            Animal.prototype.speak = function() {
              return this;
            }

            Animal.eat = function() {
              return this;
            }

            let obj = new Animal();
            let speak = obj.speak;
            speak(); // global object

            let eat = Animal.eat;
            eat(); // global object
        </script>
    </body>
</html>